<template>
	<div>
	<!--轮播图-->
  <mt-swipe :auto="4000">
  	<!--在组件中，使用V-for循环的话，一定要使用key
    <mt-swipe-item v-for='item in lunbotuList' :key='item.url'>
  	<img :src='item.img' alt="">
  </mt-swipe-item>-->
  <mt-swipe-item>
  	<img src='../../images/homeImg01.jpg' alt="">
  </mt-swipe-item>
  <mt-swipe-item>
  	<img src='../../images/homeImg02.jpg' alt="">
  </mt-swipe-item>
  <mt-swipe-item>
  	<img src='../../images/homeImg03.jpg' alt="">
  </mt-swipe-item>
  <mt-swipe-item>
  	<img src='../../images/homeImg04.jpg' alt="">
  </mt-swipe-item>
  </mt-swipe>
  
  <!--九宫格到六宫格-->
  <ul class="mui-table-view mui-grid-view mui-grid-9">
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
		            	<router-link to='/home/newslist'>
		                    <img src="../../images/menu1.png" alt=""/>
		                    <div class="mui-media-body">新闻咨询</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
		            	<router-link to=''>
		                    <img src="../../images/menu2.png" alt=""/>
		                    <div class="mui-media-body">图片分享</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
		            	<router-link to=''>
		                    <img src="../../images/menu3.png" alt=""/>
		                    <div class="mui-media-body">商品购买</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
		            	<router-link to=''>
		                    <img src="../../images/menu4.png" alt=""/>
		                    <div class="mui-media-body">留言反馈</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
		            	<router-link to=''>
		                    <img src="../../images/menu5.png" alt=""/>
		                    <div class="mui-media-body">视频专区</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
		            	<router-link to=''>
		                    <img src="../../images/menu6.png" alt=""/>
		                    <div class="mui-media-body">联系我们</div></router-link></li>
   </ul> 
 </div>
</template>

<script>
/*import { Toast } from "mint-ui";

 export default {
     data() {
       return {
        lunbotuList: [] // 保存轮播图的数组
       };
     },
     created() {
       this.getLunbotu();
     },
     methods: {
       getLunbotu() {
         // 获取轮播图数据的方法
         this.$http.get("#").then(result => {
         // console.log(result.body);
         if (result.body.status == 0) {
         // 成功了
          this.lunbotuList = result.body.message;
          } else {
          // 失败的
          Toast("加载轮播图失败。。。");
          }
        });
     }
  }
};*/
</script>


<style lang="scss" scoped>
.mint-swipe{
	height:200px;
	.mint-swipe-item{
		&:nth-child(1){
			background-color: aquamarine;
		}
		&:nth-child(2){
			background-color: cornflowerblue;
		}
		&:nth-child(3){
			background-color: greenyellow;
		}
		img{
			height: 100%;
			width:100%;
		}
	}
}

.mui-grid-view.mui-grid-9{
	background-color: #FFFFFF;
	border: none;
	img{
		width: 60px;
		height: 60px;
	}
	.mui-media-body{
		font-size: 13px;
	}
}
.mui-grid-view.mui-grid-9 .mui-table-view-cell{
	border:0;
}

</style>